<template>
    <el-dialog :before-close="closeDialog" :close-on-click-modal="false" :visible.sync="dialogVisible" align="left" width="80%"
        style="color: #000;width: 100%;" @open="openDialog">
        <!-- 任务详情信息 -->
        <div style="margin: 20px">
            <el-descriptions border :column="24">
                <el-descriptions-item label="运营沟通群" :span="8">{{ form.motionWechat }}</el-descriptions-item>
                <el-descriptions-item label="需求描述" :span="8">{{ form.demandDesc }}</el-descriptions-item>
                <el-descriptions-item label="接口规范" :span="8">{{form.interWord}}</el-descriptions-item>
            </el-descriptions>
        </div>

        <div style="height: 30px">
            <el-button v-if="id!==null" style="float: right" type="primary" @click="closeDialog">取 消</el-button>
        </div>
    </el-dialog>
</template>

<script>

import {detailRequire} from "@/api/dx/dx";

export default {
        name: "DetailDialog",
        props: {
            dialogVisible: { type: Boolean, default: false },
            id: { type: Number, default: null }
        },

        data() {
            return {
                form: {},
            }
        },

        methods: {
            openDialog() {
                if (this.id === null) {
                    this.form = {}
                } else {
                    detailRequire(this.id).then(res => {
                        this.form = res.data
                    })
                }
            },

            closeDialog() {
                this.$emit("closeDialog")
            },
        }
    }
</script>

<style scoped>

</style>
